<html>
<head>
    <meta charset="UTF-8">
    <title>考勤</title>
</head>
<body>
<script type="text/javascript" src="./$.js"></script>
<script>
    require(['!this.js'], $$.load)
</script>
</body>
</html>
<template data-name="this.htm">
    <div>
        <head_top :head="menu_top"></head_top>
        <div class="contaniner">
            <div class="sidebar">
                <menu_child :nav_data="menu_child"></menu_child>
            </div>
            <div class="main-content">
                <div class="main">
                    <div class="tab-wrap">
                        <div class="main_hd no-tab">
                            <h2>人员管理</h2>
                        </div>
                    </div>
                    <div class="cf table-bar">
                        <div class="search-form fr">
                            <search :search_data="'用户名'" v-model="key"></search>
                        </div>
                        <div class="fl">
                            <a class="btn btn_add btn_primary" @click="oneLogin"> 一键登录 </a>
                        </div>
                    </div>
                    <div class="data-table inner_container_box side_r cell_layout">
                        <div class="inner_main">
                            <div class="bd" v-if="data">
                                <div class="global_mod user_group_opr">
                                    <span class="group_name">{{dpt_name}}</span>
                                    <a class="mod_link" v-if="data.page.item_total!=0">共{{data.page.item_total}}人</a>
                                </div>
                                <div class="table_wrp user_list">
                                    <table class="table" cellspacing="0" style="display: table;">
                                        <tbody>
                                        <tr v-for="list in data.list">
                                            <td style="padding-left: 10px"></td>
                                            <td class="table_cell">
                                                <div class="user_info">
                                                    <a class="remark_name"
                                                       :href="'/sys/contact/get.html?access='+list.user_id">{{list.name}}</a>
                                                    <span class="nick_name sex_men" v-if="list.gender=='1'">男</span>
                                                    <span class="nick_name sex_women" v-if="list.gender=='2'"> 女</span>
                                                    <a class="avatar"
                                                       :href="'/sys/contact/get.html?access='+list.user_id">
                                                        <img :src="list.avatar" class="js_msgSenderAvatar">
                                                    </a>
                                                    <div class="user_tag_area">
                                                    <span class="js_tags_list user_tag_list">
                                                        <a class="js_user_tags user_tag">{{list.moblie}}</a>
                                                    </span>
                                                        <span class="js_tags_list user_tag_list"
                                                              v-if="list.status !='已关注'">
                                                         <a class="js_user_tags user_tag">{{list.status}}</a>
                                                  </span>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="table_cell user_opr tr">
                                                <a class="btn btn_default remark"
                                                   :href="'/sys/contact/get.html?access='+list.user_id">查看</a>
                                            </td>
                                        </tr>
                                        <tr v-if="data.list==''" class="empty_item">
                                            <td class="empty_tips" colspan="100">暂无数据</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="page_tool">
                                    <page :page_data="data.page" @page_click="go_page"></page>
                                </div>
                            </div>
                        </div>
                        <div class="inner_side">
                            <div class="bd">
                                <div class="group_list">
                                    <div class="inner_menu_box" v-if="depart">
                                        <dptTree :type="'dpt'" v-model="dptSelect" :body="depart"></dptTree>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <foot></foot>
    </div>
</template>

<script data-name="this.js">
    function get_lists(page) {
        $$.ajax({
            url: "/sys/user/lists",
            data: {
                page: page,
                dpt_id: $$.m.dpt_id,
                keyword: $$.m.key,
                rows: 30
            },
            result: {
                $200: function (ret) {
                    $$.m.data = ret.data;
                    $$.toast.hide();
                }
            }
        });
    }
    require('../$res/js/common');
    module.exports = {
        template: require('!this.htm'),
        methods: {
            go_page: function (page) {
                $$.toast.show();
                $$.public.scrollTop();
                get_lists(page)
            },
            oneLogin: function () {
                $$.toast.show('跳转中...');
                $$.ajax({
                    url: "/sys/open/kq_oauth",
                    result: {
                        $200: function (data) {
                            location.href = data.data.url;
                        },
                        $400: function (data) {
                            $$.alertTips.show(data.msg, 'error');
                            $$.toast.hide();
                        }
                    }
                });
            }
        },
        components: {
            'foot': $$.foot,
            'page': $$.page,
            'search': $$.search,
            'dptTree': require('../$res/component/dptTree')
        },
        computed: {
            dptSelect: {
                get: function () {
                    return [this.dpt_id, this.dpt_name]
                },
                set: function (v) {
                    this.dpt_id = v[0];
                    this.dpt_name = v[1]
                }
            }
        },
        watch: {
            dpt_id: function () {
                $$.toast.show();
                $$.m.key = '';
                get_lists();
            },
            key: function () {
                $$.toast.show();
                get_lists()
            }
        },
        loaded: function () {
            $$.m = {
                data: false,
                dpt_name: '',
                dpt_id: '',
                key: '',
                depart: false
            };
            $$.init_comps.head();
            $$.init_comps.menu();
            $$.toast.show();
            $$.public.get_depart(function () {
                get_lists();
            });
        }
    };
</script>